<template>
  <van-list
    v-model="loading"
    :finished="finished"
    finished-text="没有更多了"
    error-text="请求失败，点击重新加载"
    @load="onLoad"
  >
    <van-cell-group v-for="item in list">
      <van-cell :title="item.orderDesc" :value="item.statusDesc"/>
      <van-cell :title="'¥' + item.payAmount" :value="item.createTime" />
    </van-cell-group>
  </van-list>
</template>


<script>
  import Vue from 'vue'
  import { List, Cell, CellGroup } from 'vant'
  import 'vant/lib/index.css'

  export default {
    data () {
      return {
        list: [],
        loading: false,
        finished: false,
        page: 1,
        userId: 16
      }
    },
    created () {
      Vue.use(List)
      Vue.use(Cell)
      Vue.use(CellGroup)
      document.title = '查看订单'
      this.token = localStorage.getItem('token')
      console.log(this.token)
      if (this.token === 'undefined' || this.token === undefined || this.token === '' || this.token === null) {
        this.redirect()
      }
    },
    methods: {
      onLoad () {
        let $this = this
        this.$httpApp({
          url: this.$httpApp.adornUrl('/app/orders?page=' + this.page + '&uid=' + this.userId),
          method: 'post',
          headers: {
            token: $this.token
          },
          data: this.$httpApp.adornData({})
        }).then(({data}) => {
          if (data.code !== 0) {
            this.finished = true
            return
          }
          this.loading = false
          if (data.orderInfos.length === 0) {
            this.finished = true
          } else {
            $this.page++
            for (let i = 0; i < data.orderInfos.length; i++) {
              this.list.push(data.orderInfos[i])
            }
          }
        })
      }
    }
  }
</script>
